<%@ page language="java" pageEncoding="utf-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
${aier_doctype}
<html <s:property value="aier_html_xmlns" escape="false"/>>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta content="${aier_keyworks}" name="keywords">
<meta content="${aier_description}" name="description">
<title>${aier_title}</title>
<link rel="stylesheet" href="${aier_css_url}${aier_jqui_css}ui.css" />
<link rel="Stylesheet" href="${aier_css_url}jq/jq.css" />
<link rel="stylesheet" href="${aier_css_url}social/module/jq-msg.css" />
<link rel="stylesheet" href="${aier_css_url}social/module/reset.css" />
<link rel="stylesheet" href="${aier_css_url}social/module/btn.css" />
<link rel="stylesheet" href="${aier_css_url}social/user/ujscb.css" />

<link rel="stylesheet" href="${aier_css_url}social/user/payPlatform/common.css" />
<link rel="stylesheet" href="${aier_css_url}social/user/payPlatform/icon.css" />
<link rel="stylesheet" href="${aier_css_url}social/user/payPlatform/pay.css" />

<script type="text/javascript" src="${aier_js_url}j.js"></script>
<script type="text/javascript" src="${aier_js_url}b.js"></script>
<script type="text/javascript" src="${aier_js_url}lib/block.js"></script>
<script type="text/javascript" src="${aier_js_url}jp/msg.js"></script>
<link rel="stylesheet" href="${aier_css_url}social/module/aier-ui.css" />
<script type="text/javascript" src="${aier_js_url}aier-ui.js"></script>
</head>
<!-- 选择订单 -->
<body class="view-ujscb">

	<!-- 顶栏 -->
	<s:action name="userhomecomm_homeHead" namespace="/user"
		executeResult="true"></s:action>
	<!-- 顶栏结束 -->

	<div class="window-content">

		<!-- wrap  -->
		<div class="wrap pay-content clearfix">

			<!-- ^^^左侧导航栏 -->
			<div class="nav-side">
				<!-- 家校联系簿（家长） 头像（孩子的） -->
				<div class="ujscb-userinfo">
					<dl class="clearfix">
						<dt style="" data-log="头像" class="avatar">
							<a href="${aier_url}user/uccomm_userCenter.shtml"> <img src="${get_picturl_url}small/${userInfo.headimg}"></a>
						</dt>

						<dd class="nickname">
							<a href="${aier_url}user/uccomm_userCenter.shtml">${userInfo.nickname}</a>
						</dd>
						
						<dd class="overage-status">
							<div class="explain">
								<span id = "edate"></span>
								<a>续费</a>
							</div>
						</dd>

					</dl>
				</div>
				<!-- / 管理员头像 -->
				<div class="ujscb-sidetab-parent">
					<div class="nav-item">
						<a class="btn btn-white-3" href="${aier_url}${aier_uri}userhscb_userChiHSConBook${aier_suffix}?buid=${buid}&bname=${bname}&cid=${cid}&edate=${edate}"><span>家校联系簿</span></a>
					</div>
					<div class="nav-item current">
						<a class="btn btn-white-3 " href="${aier_url}${aier_uri}pay_selOrders${aier_suffix}?buid=${buid}&bname=${bname}&cid=${cid}"><span>购买应用</span></a>
					</div>
					<div class="nav-item">
						<a class="btn btn-white-3 btn-dialog-usb-intro" href="javacript:void(0);"><span>应用介绍</span></a>
					</div>
					<div class="nav-item">
						<a class="btn btn-white-3" href="${aier_url}${aier_uri}pay_payRecode${aier_suffix}?buid=${buid}&bname=${bname}&cid=${cid}"><span>购买记录</span></a>
					</div>
				</div>
				<!-- ^^^应用介绍 -->
				<s:action name="userhscb_userHSCBintro" namespace="/user" executeResult="true"></s:action>
				<!-- $$$应用介绍 -->
				
			</div>
			<!-- $$$左侧导航栏 -->

			<div class="con-left">
				<div class="pay-main-middle">
					<div class="middle-title">
						<ol class="buy-process-bar">
							<li class="step-first current">1.选择订单 <span
								class="highlight"></span> <span class="arrow arr-sel"></span>
							</li>
							<li>2.确认订单 <span class="highlight"></span> <span
								class="arrow"></span>
							</li>
							<li>3.支付订单 <span class="highlight"></span> <span
								class="arrow"></span>
							</li>
							<li class="step-last">4.完成</li>
						</ol>
					</div>

					<div class="middle-line"></div>

					<div class="middle-content">
						<div class="con-item1 clearfix">
							<div class="item1-left">付费账号：</div>
							<div class="item1-right">
								<input type="text" class="PY-input item-input"
									readonly="readonly" value="${paccount}">
							</div>
						</div>
						<div class="con-item1 clearfix">
							<div class="item1-left">开通宝宝：</div>
							<div class="item1-right">
								<input type="text" class="PY-input item-input"
									readonly="readonly" value="${bname}">
							</div>
						</div>
						<div class="con-item1 clearfix">
							<div class="item1-left">单价：</div>
							<div class="item1-right clearfix">
								<div class="pay-price">10</div>
								<div class="pay-unit">元/月</div>
							</div>
						</div>
						<div class="con-item1 clearfix">
							<div class="item1-left">付费模式：</div>
							<div class="item1-right clearfix">
								<label class="selected"><a class="radio-box"
									href="javascript:void(0);">按月付费<i class="icon-check"></i> </a>
								</label>
							</div>
						</div>
						<div class="con-item1 clearfix">
							<div class="item1-left">开通时长：</div>
							<div class="item1-right clearfix">
								<input id="soMonthRa" type="text" class="PY-input item-input"
									style="width:50px;"> <span>月</span>
							</div>
						</div>

						<div class="con-item1 clearfix">
							<div class="item1-left">有效期至：</div>
							<div class="item1-right clearfix">
								<div id="soValid" style="color:#64C9D8;font-weight: bold;"></div>
							</div>
						</div>

						<div class="con-item1 clearfix">
							<div class="item1-left"></div>
							<div class="item1-right">
								<div onclick="subOrder();" class="subBtn">提交订单</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- <div class="con-right"></div> -->



			<!-- 返回顶部 -->
			<s:action name="userhomecomm_backToTop" namespace="/user"
				executeResult="true"></s:action>
			<!-- end 返回顶部 -->
		</div>



		<!-- footer copyright -->
		<s:action name="userhomecomm_homeFooter" namespace="/user"
			executeResult="true"></s:action>
		<!-- /footer copyright -->
	</div>

<div class="layer-popup"></div>


</body>
<script type="text/javascript">
	//选择按月付费显示输入框
	var pattern = /^[0-9]*$/;  	
	$("#soMonthRa").live("input", function() {
		var phoneNumber = $("#soMonthRa").val();
		if(!pattern.exec(phoneNumber)){
			$("#soMonthRa").val("");
		}
		calDeadline();
	});
	
	function monNum(){
		var edate="${edate}";//用户的家校练习薄有效截止日期
		var currentDate="${currentDate}";//当前日期
		
		if(isnull(edate)){
			
			var cDate = new Date(currentDate);
			var mon = cDate.getMonth()+1;
			if(mon>=3 && 8>=mon){
				var n = 9-mon;
				$("#soMonthRa").val(n);
				cDate.setMonth(cDate.getMonth() + n);
				$("#soValid").html(cDate.getFullYear()+"年"+(cDate.getMonth()+1)+"月"+cDate.getDate()+"日");
			}else if(mon>=9 && 12>=mon){
				var n = 15-mon;
				$("#soMonthRa").val(n);
				cDate.setMonth(cDate.getMonth() + n);
				$("#soValid").html(cDate.getFullYear()+"年"+(cDate.getMonth()+1)+"月"+cDate.getDate()+"日");
				
			}else if(mon>=1 && 2>=mon){
				var n = 3-mon;
				$("#soMonthRa").val(n);
				cDate.setMonth(cDate.getMonth() + n);
				$("#soValid").html(cDate.getFullYear()+"年"+(cDate.getMonth()+1)+"月"+cDate.getDate()+"日");
			}	
		}else{	
			var date = new Date(edate);
			var m = date.getMonth()+1;
			if(m>=3 && 8>=m){
				var n = 9-m;
				$("#soMonthRa").val(n);
				date.setMonth(date.getMonth() + n);
				$("#soValid").html(date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日");
			}else if(m>=9 && 12>=m){
				var n = 15-m;
				$("#soMonthRa").val(n);
				date.setMonth(date.getMonth() + n);
				$("#soValid").html(date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日");
				
			}else if(m>=1 && 2>=m){
				var n = 3-m;
				$("#soMonthRa").val(n);
				date.setMonth(date.getMonth() + n);
				$("#soValid").html(date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日");
			}
		}
	}


	monNum();
	function subOrder() {
		
		var com_num = $("#soMonthRa").val();
		
		if(isnull(com_num)||0==com_num||com_num.trim()==""){
			$().message("请输入正确的月份！");
			return
		}
		var fun = function(data) {

			window.location.href = "${aier_url}${aier_uri}pay_confirmOrders${aier_suffix}?buid=${buid}&bname=${bname}&cid=${cid}&validity="+$("#soValid").html()+"&bill_id="+data.bill.bid;
			

		};
		exeAjax(ajaxUrl("${aier_url}${aier_urijs}pay_createBill${aier_suffix}"), fun, {
			"commidity_id": 1,
			"com_num": com_num
		});
	};
	
	
	//根据输入月份推算截止日期
	function calDeadline(){
		var com_num = $("#soMonthRa").val();
		var edate="${edate}";//用户的家校练习薄有效截止日期
		var currentDate="${currentDate}";//当前日期
		if(isnull(com_num)||0==com_num||com_num.trim()==""){
			$().message("请输入正确的月份！");
			return
		}
		if(isnull(edate)){
			var cDate = new Date(currentDate);
			cDate.setMonth(cDate.getMonth() +  parseInt(com_num));
			$("#soValid").html(cDate.getFullYear()+"年"+(cDate.getMonth()+1)+"月"+cDate.getDate()+"日");
		}else{
			var date = new Date(edate);
			date.setMonth(date.getMonth() +  parseInt(com_num));
			$("#soValid").html(date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日");
			
		}
	}
</script>
</html>